<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="../../css/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../../js/api.js"></script>
<script type="text/javascript" src="../../js/axios.js"></script>
<script type="text/javascript" src="../../js/jquery.js"></script>
</head>

<body>
<div class="place"> <span>位置：</span>
  <ul class="placeul">
    <li>采购管理</li>
    <li>商品管理</li>
    <li>修改</li>
  </ul>
</div>
<div class="formbody">
  <div class="formtitle"><span>商品信息</span></div>
  <form id="form">
    <ul class="forminfo">
      <li>
        <label>品牌名称</label>
        <select class="dfselect" name="brandName" id="brandName">
<!--          <option>请选择</option>-->
<!--          <option>联想</option>-->
<!--          <option>海尔</option>-->
        </select>
        <i>必选</i>
      </li>
      <li>
        <label>商品类型</label>
        <select class="dfselect" name="typeName" id="typeName">
<!--          <option>请选择</option>-->
<!--          <option>笔记本</option>-->
<!--          <option>电视机</option>-->
        </select>
        <i>必选</i>
      </li>
      <li>
        <label>商品型号</label>
        <input name="productModel" type="text" class="dfinput" id="productModel"/>
        <i class="modelTip">必填，不能超过50个字符</i>
      </li>
      <li>
        <label>厂商</label>
        <input name="firmName" type="text" class="dfinput" id="firmName"/>
        <i class="firmTip">必填，不能超过50个字符</i>
      </li>
      <li>
        <label>单位</label>
        <input name="productUnit" type="text" class="dfinput" id="productUnit"/>
        <i class="unitTip">必填，不能超过10个字符</i>
      </li>
      <li>
        <label>单价</label>
        <input name="productPrice" type="text" class="dfinput" id="productPrice"/>
        <i class="priceTip">必填，不能超过10个字符</i>
      </li>
      <li>
        <label>状态</label>
        <select class="dfselect" name="productStatus" id="productStatus">
          <option value="1">可用</option>
          <option value="2">不可用</option>
        </select>
        <i>必选</i>
      </li>
      <li>
        <label>创建人</label>
        <input name="createId" type="hidden" id="createId" value="101"/>
        <input name="createName" type="text" id="createName" value="马云" readonly="readonly" class="roinput" />
        <i>不能编辑</i>
      </li>
      <li>
        <label>创建时间</label>
        <input name="createTime" id="createTime" type="text" readonly="readonly" class="roinput" />
        <i>不能编辑</i>
      </li>
      <li>
        <label>&nbsp;</label>
        <input name="" type="submit" class="btn" value="确定"/>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <input name="" type="button" class="btn" value="返回" onclick="window.location.href='productList.html'"/>
      </li>
    </ul>
  </form>
</div>
<script type="text/javascript">
    let firmList=[];
    let name='';
    axiosJson(
        'get',//提交方法
        '/purchase/firmName',//提交地址
        null,
        null
    ).then((res) => {
        firmList = res.data.resultData;
    })
  let productId=getParameter("id");
  $(function () {
    $('#productModel').blur(checkModel);
    $('#productUnit').blur(checkUnit);
    $('#productPrice').blur(checkPrice);
    $('#firmName').blur(checkFirm);

    brandType();//获取brandName与typeName下拉框

    $('#form').submit(function () {
        if (checkUnit()&&checkModel()&&checkPrice()&&checkFirm()){
            let product=$('#form').serializeArray();
            axiosJson(
                'get',//提交方法
                '/purchase/addProduct',//提交地址
                product,
                null
            ).then((res) => {
                location.href="productList.html";
            })
        }
        return false;
    })

  })
  //厂商是否存在验证
  function checkFirm() {
      $('.firmTip').html("");
      let flag=true;
      let firmName=$('#firmName').val();
      if (firmName==null||firmName==''){
          $('.firmTip').html("厂商不能为空").css("color","red");
          flag=false;
      }else {
          for (let i = 0; i < firmList.length; i++) {
              if (firmName==firmList[i]&&firmName!=name){
                  flag=false;
                  $('.firmTip').html("厂商已存在").css("color","red");
                  break;
              }
          }
      }
      return flag
  }
  //数据回显
  function echon() {
    axiosJson(
            'get',//提交方法
            '/purchase/productPage',//提交地址
            null,
            {productId:productId}
    ).then((res) => {
      let audit = res.data.resultData.data[0];
      $('#brandName').val(audit.type.brand.brandName).change();

      $('#typeName').val(audit.type.typeName);
      // $('#brandName').find("option[value='"+audit.type.brand.brandName+"']").attr("select",true);
      // $('#typeName').find("option[value='"+audit.type.typeName+"']").attr("select",true);
      $('#productModel').val(audit.productModel);
      $('#firmName').val(audit.firm.firmName);
      $('#productUnit').val(audit.productUnit);
      $('#productPrice').val(audit.productPrice);
      $('#productStatus').val(audit.productStatus);
      $('#createId').val(audit.createId);
      $('#createName').val(audit.creator.uName);
      $('#createTime').val(audit.createTime);
      name=audit.firm.firmName;
    })
  }

  //获取brandName与typeName下拉框
  function brandType() {
      axiosJson(
          'get',//提交方法
          '/purchase/brandType',//提交地址
          null,
          null
      ).then((res) => {
          let audit=res.data.resultData;
          let lis=''
          $.each(audit,function (k,v) {
              lis+='<option>'+k+'</option>';
          })
          $('#brandName').change(function () {
              let brandName=$('#brandName').val();
              let typeName = audit[brandName];
              let str=''
              for (let i=0;i<typeName.length;i++){
                  str+='<option>'+typeName[i]+'</option>';
              }
              $('#typeName').html(str);
          }).html(lis).change();
          echon();
      })
  }
  //商品型号验证
  function checkModel() {
    let model=$('#productModel').val();
    if (model==null||model==''){
      $('.modelTip').html("商品型号不能为空").css("color","red");
      return false;
    }else {
      $('.modelTip').html("");
    }
    return true
  }
  //商品单位验证
  function checkUnit() {
    let unit=$('#productUnit').val();
    if (unit==null||unit==''){
      $('.unitTip').html("单位不能为空").css("color","red");
      return false;
    }else {
      $('.unitTip').html("");
    }
    return true
  }
  //商品单价验证
  function checkPrice() {
    let price=$('#productPrice').val();
    if (price==null||price==''){
      $('.priceTip').html("单价不能为空").css("color","red");
      return false
    }else {
      $('.priceTip').html("");
    }
    return true
  }
</script>
</body>
</html>
